/*******************************************************************************
*                                                                              *
* Typography                                                                   *
*                                                                              *
******************************************************************************/

.typo {
	-fx-text-fill: #58585A;
	-fx-fill-color: #58585A;
	-fx-fill: #58585A;
	-fx-font-smoothing-type: lcd;
}

.page-header {
	-fx-font-family: "Segoe UI Light";
	-fx-font-size: 48pt;
}

.page-subheader {
	/*-fx-font-family: "Segoe UI Light";*/
	-fx-font-family: "Segoe UI";
	-fx-font-size: 24pt;
}

.item-header {
	-fx-font-family: "Segoe UI Semibold";
	-fx-font-size: 20pt;
}

.item-subheader {
	-fx-font-family: "Segoe UI";
	-fx-font-size: 20pt;
}

.item-tertiary-header {
	-fx-font-family: "Segoe UI";
	-fx-font-size: 15pt;
}

.navigation {
	-fx-font-family: "Segoe UI";
	-fx-font-size: 15pt;
}

.body {
	-fx-font-family: "Segoe UI";
	-fx-font-size: 15pt;
}

.body-secondary {
	-fx-font-family: "Segoe UI";
	-fx-font-size: 15pt;
}

.link {
	-fx-font-family: "Segoe UI";
	-fx-font-size: 15pt;
}

.tertiary-info {
	-fx-font-family: "Segoe UI";
	-fx-font-size: 11pt;
}

.form-label {
	/* -fx-font-family: "Segoe UI Bold"; */
	-fx-font-family: "Segoe UI Semibold";
	-fx-font-size: 15pt;
	-fx-text-fill: #898989;
}

.secondary {
	-fx-opacity: 0.6;
}

.bold {
	-fx-font-weight: bold;
}

.labelled-field {
	-fx-spacing: 5px;
}

/*******************************************************************************
*                                                                              *
* Category item links                                                          *
*                                                                              *
******************************************************************************/

.item {
	-fx-background-color: #FFFFFF;
}

.item:hover {
	-fx-background-color: #DEDEDE;
	/*-fx-background-color: #4EA6EA;*/
}

.item:hover .link {
	-fx-cursor: default;
	-fx-underline: false;
	/*-fx-text-fill: #FFF;*/
}

.hyperlink:pressed {
	-fx-border-color: transparent;
}

.hyperlink:focused {
	-fx-border-style: solid;
	-fx-borde-width: 1px;
	-fx-border-color: #4EA6EA;
}

.itemlist {
	-fx-spacing: 5px;
}

/*******************************************************************************
*                                                                              *
* Buttons                                                                      *
*                                                                              *
*******************************************************************************/

.button {
	-fx-background-color: #0072BB;
	-fx-background-radius: 0;
	-fx-text-fill: #FFFFFF;
	-fx-font-size: 18;
}

.button:hover {
	-fx-background-color: #00B8FF;
	/*-fx-cursor: "hand";*/
}

.button:focused {
    -fx-border-color: white;
    -fx-border-width: 1;
    -fx-border-style: solid;
    -fx-border-radius: 0;
}

.button:disabled, .button:default:disabled {
    -fx-background-color: #cccccc;
    -fx-text-fill: #212121;
}

/*******************************************************************************
*                                                                              *
* Text forms                                                                   *
*                                                                              *
*******************************************************************************/

.text-field, .text-area {
	-fx-background-radius: 0;
	-fx-padding: 5px;
}

.text-field:focused, .text-area:focused {
	-fx-background-insets: 0, 0, 0, 0; /* Remove glow */
	-fx-border-color: #4EA6EA;
}

.validation-ok {
	-fx-font-size: 15pt;
	-fx-padding: 0 0 0 10px;
	-fx-graphic-text-gap: 10px;
	-fx-text-fill: #86C440;
}

.validation-warning {
	-fx-font-size: 15pt;
	-fx-padding: 0 0 0 10px;
	-fx-graphic-text-gap: 10px;
	-fx-text-fill: #F9A31A;
}

.validation-error {
	-fx-font-size: 15pt;
	-fx-padding: 0 0 0 10px;
	-fx-graphic-text-gap: 10px;
	-fx-text-fill: #FF1E00;
}

/*******************************************************************************
*                                                                              *
* Tooltips                                                                     *
*                                                                              *
*******************************************************************************/

.tooltip {
	-fx-skin: "com.sun.javafx.scene.control.skin.TooltipSkin";
	-fx-background-color: #F1F2F7;
	-fx-background-radius: 0 0 0 0;
	-fx-border-width: 0;
	-fx-border-color: #767676;
	/* You need drop shadow to push the tooltip away from the cursor */
	-fx-effect: dropshadow( three-pass-box , rgba(0,0,0,0.6) , 8, 0.0 , 0 , 0 );
}

.validation-popup {
	-fx-padding: 5px;
	-fx-background-color: #F1F2F7;
	-fx-background-radius: 0 0 0 0;
	-fx-border-width: 0;
	-fx-border-color: #767676;
	-fx-effect: dropshadow( three-pass-box , rgba(0,0,0,0.6) , 8, 0.0 , 0 , 0 );
}

.page-corner {
    -fx-shape: " ";
}

/*******************************************************************************
*                                                                              *
* Scrollbars                                                                   *
*                                                                              *
*******************************************************************************/

.scroll-bar .thumb{
    -fx-background-color: #cdcdcd;
    -fx-background-insets: 0;
    -fx-background-radius: 0;
}

.scroll-bar .thumb:hover {
    -fx-color: #dadada;
}

.scroll-bar .thumb:pressed {
    -fx-background-color: #606060;
}

.scroll-bar .track {
    -fx-background-color: #f0f0f0;
    -fx-background-insets: 0;
    -fx-background-radius: 0;
}
.scroll-bar .track-background {
    -fx-background-color: #f0f0f0;
    -fx-background-insets: 0;
}

.scroll-bar .increment-button, .scroll-bar .decrement-button {
    -fx-background-color: #f0f0f0;
    -fx-background-insets: 0;
    -fx-background-radius: 0;
    -fx-padding: 0.25em;
}

.scroll-bar .increment-button:hover, .scroll-bar .decrement-button:hover {
    -fx-background-color: #dadada;
}

.scroll-bar .increment-button:pressed, .scroll-bar .decrement-button:pressed {
    -fx-background-color: #606060;
}

.scroll-bar:horizontal .increment-arrow {
    -fx-background-color: -fx-mark-highlight-color, -fx-mark-color;
    -fx-background-insets: 1 0 -1 0, 0;
    -fx-padding: 0.5em 0.333333em 0.0em 0.0em;
    -fx-shape: "M7.626,12.876L4.251,8.751H7.14L11,12.876L7.14,17H4.251L7.626,12.876z";
}

.scroll-bar:vertical .increment-arrow {
    -fx-background-color: -fx-mark-highlight-color, -fx-mark-color;
    -fx-background-insets: 1 0 -1 0, 0;
    -fx-padding: 0.333333em 0.5em 0.0em 0.0em;
    -fx-shape: "M8.124,13.625l4.125-3.375v2.889l-4.125,3.86L4,13.139V10.25L8.124,13.625z";
}

.scroll-bar .increment-button:pressed .increment-arrow {
    -fx-background-color: white, white;
}

.scroll-bar:horizontal .decrement-arrow {
    -fx-background-color: -fx-mark-highlight-color, -fx-mark-color;
    -fx-background-insets: 1 0 -1 0, 0;
    -fx-padding: 0.5em 0.333333em 0.0em 0.0em;
    -fx-shape: "M11,17H8.111l-3.86-4.124l3.86-4.125H11l-3.375,4.125L11,17z";
}

.scroll-bar:vertical .decrement-arrow {
    -fx-background-color: -fx-mark-highlight-color, -fx-mark-color;
    -fx-background-insets: 1 0 -1 0, 0;
    -fx-padding: 0.333333em 0.5em 0.0em 0.0em;
    -fx-shape: "M4,17v-2.889l4.124-3.86l4.125,3.86V17l-4.125-3.375L4,17z";
}

.scroll-bar .decrement-button:pressed .decrement-arrow {
    -fx-background-color: white, white;
}

.scroll-bar:disabled {
    -fx-opacity: 0.4;
}

/*******************************************************************************
*                                                                              *
* ListViews                                                                    *
*                                                                              *
*******************************************************************************/

.list-view {
	-fx-font-size: 15pt; /* Scrollbar width is based off font size */
}

.list-view:focused {
	-fx-background-insets: 0, 0, 1, 2;
}

.list-view .list-cell:odd {
	-fx-background-color: -fx-control-inner-background;
}

.list-view .list-cell:filled:hover {
	-fx-background-color: #DEDEDE;
}

.list-view .list-cell:selected {
	-fx-background-color: #4EA6EA;
}

.list-view .list-cell:selected:hover {
    -fx-background-color: #6dcdff;
}

.scroll-pane {
	-fx-font-size: 15pt; /* Scrollbar width is based of font size */
}

/*******************************************************************************
*                                                                              *
* Comboboxes                                                                   *
*                                                                              *
*******************************************************************************/

.combo-box-base {
    -fx-background-color: transparent, #bababa, transparent, white;
    -fx-background-radius: 0, 0, 0, 0;
    -fx-padding: 0.166667em;
}

.combo-box-base:hover {
    -fx-background-color: transparent, #909090, transparent, white;
}

.combo-box-base .arrow-button {
    -fx-background-color: transparent, transparent, white;
}

.combo-box-base .arrow {
    -fx-padding: 0.333333em 0.333333em 0.333333em 0.333333em;
    -fx-shape: "M8.124,13.625l4.125-3.375v2.889l-4.125,3.86L4,13.139V10.25L8.124,13.625z";
}

.combo-box-popup .list-view {
    -fx-background-color: #909090, -fx-control-inner-background;
    -fx-effect: dropshadow( three-pass-box , rgba(0,0,0,0) , 8, 0.0 , 0 , 0 );
}

.combo-box-popup .list-view .list-cell:hover {
    -fx-background-color: #dedede;
    -fx-text-fill: #1d1d1d;
}

.combo-box-popup .list-view .list-cell:filled:selected {
    -fx-background-color: #4EA6EA;
}

.combo-box-popup .list-view .list-cell:filled:selected:hover {
    -fx-background-color: #6dcdff;
}

.combo-box-popup .list-view .list-cell:filled:pressed, .combo-box-popup .list-view .list-cell:filled:selected:pressed {
    -fx-background-color: #d3d3d3;
    -fx-text-fill: #1d1d1d;
}

/*******************************************************************************
*                                                                              *
* Tab Pane                                                                     *
*                                                                              *
*******************************************************************************/

.tab-pane *.tab-header-background {
    -fx-background-color: null;
}

.tab-pane .headers-region {
    -fx-effect: null;
}

.tab-content-area {
	-fx-padding: 20px 0 0 20px;
}

.tab {
	-fx-background-color: null;
	/* -fx-cursor: hand; */
	-fx-border-color: transparent transparent #FFFFFF transparent;
	-fx-border-width: 5;
}

.tab .tab-label {
	-fx-font-weight: bold;
    -fx-background-color: transparent;
    -fx-effect: null;
    -fx-alignment: CENTER;
    -fx-text-fill: #333;
}

.tab:hover .tab-label {
    -fx-text-fill: #4EA6EA;
}

.tab:selected {
    -fx-background-radius: 5 5 0 0;
    -fx-border-width: 5;
    -fx-border-color: transparent transparent #4EA6EA transparent;
}

.tab:selected .tab-label {
    -fx-text-fill: #4EA6EA;
}

/*******************************************************************************
*                                                                              *
* Specific UI Styling                                                          *
*                                                                              *
*******************************************************************************/

/*******************************************************************************
*                                                                              *
* Window controls (OK+Cancel)                                                  *
*                                                                              *
*******************************************************************************/

.window-control {
	-fx-alignment: center;
	-fx-spacing: 25px;
	-fx-padding: 20px;
}

.window-control .button {
	-fx-font-size: 15pt;
}

/*******************************************************************************
*                                                                              *
* Topbar                                                                       *
*                                                                              *
*******************************************************************************/

.main-topbar {
    -fx-alignment: center;
    -fx-padding: 20px 20px 20px 40px;
    -fx-background-color: #1D1D1D;
    -fx-spacing: 20px;
}

/*******************************************************************************
*                                                                              *
* Budget + expenditure                                                         *
*                                                                              *
*******************************************************************************/


.main-topbar-budgetbox {
	-fx-font-size: 18;
	-fx-alignment: center;
}

.main-topbar-budgetbox-prepend {
	-fx-fill: #FFFFFF;
}

.main-topbar-budgetbox-separator {
	-fx-fill: #FFFFFF;
}

.main-topbar-budgetbox-budget {
	-fx-padding: 5px;
	-fx-background-color: #3d3d3d;
	-fx-text-fill: #FFFFFF;
}

.main-topbar-budgetbox-budget:focused {
	-fx-background-color: #ddd;
	-fx-border-style: solid;
	-fx-border-width: 1;
	-fx-border-color: #4EA6EA;
	-fx-text-fill: #333333;
}

/*******************************************************************************
*                                                                              *
* Alerts                                                                       *
*                                                                              *
*******************************************************************************/

/* Alerts are currently hardcoded in MainView.java*/
/*
.main-view-budgetbox-noalert {
	-fx-fill: #FFFFFF;
}

.main-view-budgetbox-alert {
	-fx-fill:rgb(255,0,0);
}*/

/*******************************************************************************
*                                                                              *
* Search box                                                                   *
*                                                                              *
*******************************************************************************/

.main-topbar-searchbox-searchfield {
    -fx-background-image: url("searchw16.png");
	-fx-background-repeat: no-repeat;
	-fx-background-position: right center;
  	-fx-font-size: 18;
	-fx-background-color: #3d3d3d;
	-fx-padding: 4px 24px 4px 5px;
}

.main-topbar-searchbox-searchfield:focused {
	-fx-background-image: url("search16.png");
	-fx-background-color: #ddd;
	-fx-border-style: solid;
	-fx-border-width: 1;
	-fx-border-color: #4EA6EA;
	-fx-text-fill: #333333;
}

/*******************************************************************************
*                                                                              *
* Bottom bar                                                                   *
*                                                                              *
*******************************************************************************/

.main-bottombar {
	-fx-padding: 20px 20px 20px 40px;
	-fx-spacing: 5px;
}

.main-bottombar-statusline {
	-fx-spacing: 5px;
}

.main-bottombar-statusbar {
	-fx-padding: 3px 0 0 0; /* FIXME: align to baseline */
}

.main-bottombar-undobuttonbox-undobutton {
	-fx-font-size: 15pt;
}

.main-bottombar-commandlinefield {
	-fx-font-size: 15pt;
}

/*******************************************************************************
*                                                                              *
* Expense details dialog                                                       *
*                                                                              *
*******************************************************************************/

.expense-detail-view {
	-fx-spacing: 20px;
	-fx-padding: 20px 20px 0 40px;
}

.expense-detail-view-title {
	-fx-padding: 20px 20px 0 40px;
}

/*******************************************************************************
*                                                                              *
* Expense list sidebar                                                         *
*                                                                              *
*******************************************************************************/

.expense-list-view-wrapper {
	-fx-padding: 20px 20px 0 40px;
}

.expense-list-view-sidebar {
	-fx-background-color: #FFFFFF;
	-fx-spacing: 10px;
}

.expense-list-view-sidebar:focused {
	-fx-border-size: 0;
	-fx-background-insets: 0;
}

.expense-list-view-sidebar-filters {
	-fx-spacing: 20px;
}

.expense-list-view-sidebar-all {
	-fx-spacing: 5px;
}

.expense-list-view-category-dragover {
	-fx-border-style: solid;
	-fx-border-width: 1;
	-fx-border-color: #4EA6EA;
}

.expense-list-view-category-dragexit {
	-fx-border-style: none;
}

.expense-list-view-categorylist-newcategory {
	-fx-padding: 5px;
}

/*******************************************************************************
*                                                                              *
* Expense ListView                                                             *
*                                                                              *
*******************************************************************************/

.expense-list-view-expenselist {
	-fx-background-insets: 0 0 0 0; /* Remove border */
	-fx-padding: 0 20 0 0;
}

.expense-list-view-expenselist:focused {
	-fx-background-insets: 0 0 0 0; /* Remove focus glow */
}

.expense-list-view-item {
	-fx-spacing: 10px; /* Between accent and details */
}

.expense-list-view-item-topline {
	-fx-spacing: 10px;
}

.expense-list-view-item-middleline {
	-fx-spacing: 10px;
}

.expense-list-view-item-bottomline {
	-fx-spacing: 5px;
}

.expense-list-view-lines {
	-fx-spacing: 5px; /* Between lines */
}

.expense-list-view-item-controls {
	-fx-spacing: 5px;
}

.controls-inactive {
	-fx-opacity: 0;
}

.controls-active {
	-fx-opacity: 1;
}

.controls-active .button {
	-fx-font-size: 16pt;
}

.controls-inactive .button {
	-fx-font-size: 16pt;
}

.controls-active .text-field {
	-fx-padding: 4px;
}

.expense-list-view-currentquery-box {
	-fx-padding: 21px 10px 10px 0;
}

/*******************************************************************************
*                                                                              *
* Generate reports                                                             *
*                                                                              *
*******************************************************************************/

.generate-report-view-text {
	-fx-padding: 20px 20px 0 40px;
}

.generate-report-view-tabpane-wrapper {
	-fx-padding: 0 20px 20px 25px; /* FIXME: Alignment hack, find a way to style leading space in header */
}

.generate-report-view-statistics-box {
	-fx-padding: 0 20px 0 0;
	-fx-spacing: 10px;
}

.generate-report-view-tab-content {
	-fx-spacing: 20px;
}

.generate-report-view-scrollpanewrapper {
	-fx-background-color: transparent;
	-fx-padding: 0;
}

.generate-report-view-date-pickertextfield {
	-fx-font-size: 15pt;
}

.generate-report-view-date-pickerbox {
	-fx-spacing: 20px;
	-fx-padding: 0 0 20px 0;
}

.generate-report-view-date-pickeroffset {
	-fx-spacing: 20px;
}

/*******************************************************************************
*                                                                              *
* Chart top-level items                                                        *
*                                                                              *
*******************************************************************************/

.chart {
    -fx-padding: 0;
}

.chart-content {
    -fx-padding: 10px;
}

.chart-title {
    /*-fx-font-size: 15pt;*/
	-fx-font-family: "Segoe UI";
	-fx-font-size: 24pt;
	-fx-text-fill: #58585A;
	-fx-fill-color: #58585A;
	-fx-fill: #58585A;
	-fx-padding: 0 0 20px 0;
	/* -fx-alignment: baseline-left; */
}

.chart-legend {
    -fx-background-color:  #cccccc, #eeeeee;
    -fx-background-insets: 0,1;
    -fx-background-radius: 0,0;
    -fx-padding: 10px;
}
